import Vue from 'vue'
import Vuex from 'vuex'
import axios from "axios"

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    goods: [],//商品数据
    slid: [],//筛选数据
    cart: JSON.parse(localStorage.getItem("cart")) || [],//购物车
    allChecked: JSON.parse(localStorage.getItem("allChecked")) || false,//全选状态
    allPrice: JSON.parse(localStorage.getItem("allPrice")) || 0,//总价
  },
  mutations: {
    getGoods(state, items) {
      state.goods = items.list
      state.slid = items.slider
    },
    add_Cart(state, item) {
      //商品去重
      var result = true;
      state.cart.forEach(element => {
        if (element.productId == item.productId) {
          element.num++
          result = false
        }
      })
      if (result) {
        item.num = 1
        item.checked = false
        state.cart.push(item)
      }
      //同步本地
      localStorage.setItem("cart", JSON.stringify(state.cart))
    },
    cart_Radio(state, item) {
      //单选  修改当前item的属性
      state.cart.forEach(element => {
        if (element.productId == item.id) {
          element.checked = item.checked
        }
      })
      //深拷贝--全选状态同步单选状态
      state.cart = [...state.cart]
      state.allChecked = state.cart.every(ele => {
        return ele.checked == true
      })

      //计算总价
      state.allPrice = 0
      state.cart.forEach(element => {
        if (element.checked) {
          state.allPrice += (element.salePrice * element.num) * 100
        }
      })
      //同步本地--选中状态--总价格--购物车数据
      localStorage.setItem("cart", JSON.stringify(state.cart))
      localStorage.setItem("allChecked", JSON.stringify(state.allChecked))
      localStorage.setItem("allPrice", JSON.stringify(state.allPrice))
    },
    all_Checked(state, item) {
      //全选状态
      state.allChecked == item
      //单选状态同步全选状态
      state.cart.forEach(ele => {
        ele.checked = item
      })

      //计算总价
      state.allPrice = 0
      state.cart.forEach(element => {
        if (element.checked) {
          state.allPrice += (element.salePrice * element.num) * 100
        }
      })
      //同步本地--选中状态--总价格--购物车数据
      localStorage.setItem("cart", JSON.stringify(state.cart))
      localStorage.setItem("allChecked", JSON.stringify(state.allChecked))
      localStorage.setItem("allPrice", JSON.stringify(state.allPrice))
    },
    add_Ition(state, item){
      //增加数量
      state.cart.forEach(el=>{
        if(el.productId == item.productId){
          el.num++
        }
      })

      //计算总价
      state.allPrice = 0
      state.cart.forEach(element => {
        if (element.checked) {
          state.allPrice += (element.salePrice * element.num) * 100
        }
      })
      //同步本地--总价格--购物车数据
      localStorage.setItem("cart", JSON.stringify(state.cart))
      localStorage.setItem("allPrice", JSON.stringify(state.allPrice))
    },
    Reduce(state, item){
      //减少数量
      state.cart.forEach(el=>{
        if(el.productId == item.productId){
          el.num--
        }
      })

      //计算总价
      state.allPrice = 0
      state.cart.forEach(element => {
        if (element.checked) {
          state.allPrice += (element.salePrice * element.num) * 100
        }
      })
      //同步本地--总价格--购物车数据
      localStorage.setItem("cart", JSON.stringify(state.cart))
      localStorage.setItem("allPrice", JSON.stringify(state.allPrice))
    }
  },
  actions: {
    getGoods(context) {
      axios.get('/api/data.json')
        .then(res => {
          // console.log(res.data.result)
          context.commit('getGoods', res.data.result)
        }).catch(err => {
          console.error(err)
        })
    },
    add_Cart(context, item) {
      //加购物车
      context.commit("add_Cart", item)
    },
    cart_Radio(context, item) {
      //单选按钮
      context.commit("cart_Radio", item)
    },
    all_Checked(context, item) {
      //全选状态
      context.commit("all_Checked", item)
    },
    add_Ition(context, item){
      //增加数量
      context.commit("add_Ition", item)
    },
    Reduce(context, item){
      //减少数量
      context.commit("Reduce", item)
    }
  },
  modules: {
  }
})
